import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'app-stars',
  templateUrl: './stars.component.html',
  styleUrls: ['./stars.component.css']
})
export class StarsComponent implements OnInit {

  //输入参数：父组件传递给子组件的值
  @Input()
  private rating: number = 0;

  private stars: boolean[];

  @Input()
  private readonly: boolean = true;

  @Output()
  private ratingEvent:EventEmitter<number>=new EventEmitter();

  constructor() { }

  ngOnInit() {
    this.stars = [];
    //判断如果大于rating分数则是实心星星(false)，否则是空心星星(true)
    for (let i = 1; i <= 5; i++) {
      this.stars.push(i > this.rating);
    }
  }

  clickStar(index: number) {
    if (!this.readonly) {
      //index从0开始，而rating是从1开始，所以加一
      this.rating = index + 1;
      //重新加载效果
      this.ngOnInit();
      this.ratingEvent.emit(this.rating);
    }
  }

}
